{% extends "base.jinja" %}

{% block title %}找回密码{% endblock %}

{% block css %},user.css{% endblock %}

{% block main %}
	<style>
	.site-top, .footer, .site-side, .supplier-join {display:none;}
	.getpwd {margin:90px auto;width:580px;background:#fff;overflow:hidden;}
		.getpwd-logo {height:86px;background:#f49999;}
			.getpwd-logo a {display:block;margin:0 auto;width:214px;height:86px;background:url(http://s.lovewith.me/static/images/share-to-wx.png) no-repeat 0 0;}
		.getpwd-box {float:left;padding:30px 0;width:580px;}
			.getpwd-box ol {padding-left:19px;overflow:hidden;}
				.getpwd-box li {position:relative;float:left;padding-bottom:36px;width:185px;text-align:center;font-size:14px;color:#888;}
					.getpwd-box span {position:absolute;bottom:0;left:50%;margin-left:-11px;border:1px solid #b0b0b0;width:22px;height:22px;line-height:24px;border-radius:100%;text-align:center;text-indent:-1px;}
						.getpwd-box span:after {content:'';position:absolute;bottom:11px;left:24px;width:160px;height:1px;background:#eee;}
					.getpwd-box .getpwd-reset span:after {display:none;}
				.getpwd-box .current {color:#666;}
					.getpwd-box .current span {border-color:#ea8989;color:#fff;background:#ea8989;}
	
			.getpwd-form {padding-top:40px;margin:0 auto;width:300px;}
			.getpwd-loading {background:url(http://s.lovewith.me/static/images/loading.gif) no-repeat 50% 50%;}
				.getpwd-loading * {visibility:hidden;}
				.getpwd-form .inp-text, .getpwd-form .inp-btn-pk {display:block;margin:0 auto;}
				.getpwd-form .inp-text {margin-bottom:15px;width:290px;}
				.getpwd-error {display:none;margin-bottom:15px;padding-left:24px;line-height:14px;color:#888;overflow:hidden;}
					.getpwd-error:after {top:0;left:0;width:14px;height:14px;background-position:-312px -212px;}
				.getpwd-form .inp-btn-pk {padding:0;width:300px;}

				.getpwd-sended {margin-bottom:20px;text-align:center;font-size:14px;color:#888;}
				.getpwd-sended  b {font-weight:100;color:#ea8989;}
			.getpwd-resuccess {padding:0 0 30px 36px;text-align:center;font-size:16px;color:#a9a9a9;}
				.getpwd-resuccess:after {top:0;left:84px;width:26px;height:26px;background:url(http://s.lovewith.me/static/images/user.png?t={sitemap}) no-repeat -200px 0;}
	</style>
	<div class="getpwd" id="getpwd">
		<div class="getpwd-logo"><a target="_blank" href="{{domain}}"></a></div>
		<div class="getpwd-box">
			<ol>
				{% if confirm_data %}
					<li class="current"><span>1</span>输入邮箱地址</li>
					<li class="current"><span>2</span>邮箱验证</li>
					<li class="current getpwd-reset"><span>3</span>重置密码</li>
				{% else %}
					<li class="current"><span>1</span>输入邮箱地址</li>
					<li><span>2</span>邮箱验证</li>
					<li class="getpwd-reset"><span>3</span>重置密码</li>
				{% endif %}
			</ol>
			<div class="getpwd-form">
				{% if confirm_data %}
					<input type="hidden" name="key" value="{{confirm_data.confirm_key}}" />
					<input type="password" name="pwd" class="inp-text" placeholder="请输入新密码" />
					<input type="password" name="rep-pwd" class="inp-text" placeholder="重复输入新密码" />
					<p class="ui-a getpwd-error">2次输入的密码不一致。</p>
					<a href="javascript:;" class="inp-btn-pk" data-action="savepwd">确定</a>
				{% else %}
					<input type="text" name="" class="inp-text" placeholder="请输入您的邮箱" value="请输入您的邮箱" />
					<p class="ui-a getpwd-error">您输入的邮箱不存在，请重新输入</p>
					<a href="javascript:;" class="inp-btn-pk" data-action="checkemail">下一步</a>
				{% endif %}
			</div>
		</div>
	</div>
{% endblock %}

{% block script %}
<script>
seajs.use('widget', function(Widget){
	var GetPassword = Widget.extend({
		attrs: {
			element: $('#getpwd')
		},
		events: {
			'focus .inp-text': function(e){
				var el = $(e.currentTarget);

				if(el.attr('placeholder') == el.val()){el.val('')}
			},
			'blur .inp-text': function(e){
				var el = $(e.currentTarget);

				if(el.val() == '' && el.attr('type') == 'text'){el.val(el.attr('placeholder'))}
			},
			'click .inp-btn-pk[data-action="checkemail"]': function(){
				var self = this;
				var emailEl = this.element.find('.inp-text');

				emailEl.focus();

				if(emailEl.val() != ''){
					$.getJSON('/u/ajax/checkuser/?email='+ emailEl.val(), function(result){
						//email不存在
						if(!result.error){
							emailEl.next().show();
						}else{
							emailEl.next().hide();
							self.sendMail(emailEl.val());
						}
					});
				}
			},
			'click .inp-btn-pk[data-action="savepwd"]': function(e){
				var el = $(e.currentTarget);
				var key = el.parent().find('input[name=key]').val();
				var pwd = el.parent().find('input[name=pwd]').val();
				var repPwd = el.parent().find('input[name=rep-pwd]').val();

				el.prev().hide();

				if(pwd == '' || pwd.length < 6){
					el.prev().html('请输入6位以上字母、数字组合').show();
					return false;
				}

				if(pwd != repPwd){
					el.prev().html('2次输入的密码不一致').show();
					return false;
				}

				el.parent().addClass('getpwd-loading');

				$.ajax({
                    type: 'POST',
                    url: '/u/ajax/p/save_new_password/',
                    data: 'key='+ key +'&pwd='+ pwd +'&csrfmiddlewaretoken='+ $('#csrf').val(),
                    dataType:'json',
                    success:function (result){
                    	if(!result.error){
                    		el.parent().removeClass('getpwd-loading').html('<p class="ui-a getpwd-resuccess">密码重置成功</p>');
                    		setTimeout(function(){
                    			window.location.href = '/u/sign/';
                    		}, 1200)
                    	}
                    }
                });
			}
		},
		getMailSite: function(email){
			var domain = email.split('@')[1].toLowerCase();
			
			switch(domain){
				case 'qq.com':
					return 'http://mail.qq.com/';
				case 'vip.qq.com':
					return 'http://mail.qq.com/';
				case 'hotmail.com':
					return 'http://www.hotmail.com/';
				case 'yahoo.cn':
					return 'http://mail.yahoo.com/';
				case 'yahoo.com.cn':
					return 'http://mail.yahoo.com/';
				case '163.com':
					return 'http://mail.163.com/';
				case '126.com':
					return 'http://mail.126.com/';
				case 'gmail.com':
					return 'http://mail.google.com/';
				case 'live.cn':
					return 'http://www.live.cn/';
				case 'outlook.com':
					return 'http://www.live.cn/';
				case 'vip.sina.com':
					return 'http://mail.sina.com/';
				case 'sina.cn':
					return 'http://mail.sina.com/';
				case 'sina.com':
					return 'http://mail.sina.com/';
				case '139.com':
					return 'http://mail.139.com/';
				case 'foxmail.com':
					return 'http://mail.foxmail.com/';
				default:
					return 'http://'+ domain +'/';
			}
		},
		//发送邮件
		sendMail: function(email){
			var self = this;
			var el = self.element.find('.getpwd-form');
			var mailLink = self.getMailSite(email);

			el.addClass('getpwd-loading');

			$.getJSON('/u/ajax/g/send_get_password_mail/?email='+ email, function(){
				self.element.find('li').eq(1).addClass('current');
				el.removeClass('getpwd-loading').html(
					'<div class="getpwd-sended">密码重置邮件已经发送至邮箱：<br /><b>'+ email +'</b></div>'+
					'<a href="'+ mailLink +'" target="_blank" class="inp-btn-pk">登录邮箱</a>'
				);
			});
		}
	});
	
	new GetPassword().render();
});
</script>
{% endblock %}